<!DOCTYPE html>
<html class="ui-page-login">

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title></title>
	<link href="../css/mui.min.css" rel="stylesheet" />
	<link rel="stylesheet" type="text/css" href="../css/pages/reg.css" />
	<style>
		body {
			background-color: #fff;
		}

		.mui-content {
			background-color: #fff;
		}
	</style>
</head>

<body>
	<div id="app" class="content">
		<div class="logo">
			更换手机号
		</div>
		<form>
			<div class="itemClass">
				<input type="number" placeholder="请输入手机号" v-model="ipone" class="mui-input-clear mui-input">
			</div>
			
			<div class="item-code">
				<div class="code-input">
					<input type="number" v-model="code" placeholder="验证码" />
				</div>
				<span class="code-btn" v-text="codetxt" @click="getCodeTap"></span>
			</div>
		</form>
		<div class="login" @click="loginTap">完成</div>
	</div>
	<script src="../js/Width.js"></script>
	<script src="../js/mui.min.js"></script>
	<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/app.js"></script>
	<script src="../js/Util.js"></script>
	<script src="https://cdn.bootcss.com/fastclick/1.0.6/fastclick.min.js"></script>
	<script>
		mui.plusReady(function () {
			if (!mui.os.android) {
				FastClick.attach(document.body);
			}
			plus.webview.currentWebview().setStyle({
				softinputMode: "adjustResize"
			});
		})

		var app = new Vue({
			el: "#app",
			data: {
				num: 0,
				ipone: '',
				code: '',
				codetxt: '发送验证码',
				codeBtn: false
			},
			methods: {
				getCodeTap: function () {
					var that = this
					var phone = this.ipone
					if (this.codeBtn) {
						console.log('无法点击')
						return;
					} else {
						// 调用获取短信验证方法
						Util.getCode(phone, function (codetxt, codeBtn) {
							that.codetxt = codetxt;
							that.codeBtn = codeBtn;
						})
					}
				},
				loginTap: function () {
					var that = this
					if (!that.ipone || !that.code) {
						mui.toast('请填写完整')
						return
					}
					if (Util.checkPassword(that.password)) {
						plus.nativeUI.showWaiting('提交中', {
							width: '100px',
							height: '100px'
						});
						mui.post(Util.HTTP + 'api/Users/UpdateUserName', {
							userID: Util.getState('$state').userID,
							newUserName: that.ipone,
							captcha: that.code
						}, function (res) {
							if (res.code == 1001) {
								plus.nativeUI.closeWaiting();
								mui.toast('更换成功')
								setTimeout(function () {
									mui.back()
								}, 1000)
							} else {
								mui.toast(res.message)
							}
						})
					}
				}
			},
		})
	</script>
</body>

</html>
